<template>
  <div class="goods-index">
    <!-- 头部 -->
    <div class="coupon">
      <NavBar />
      <!-- 轮播图图 -->
      <Swiper :banners="banners" />
    </div>

    <!-- list_info -->
    <div class="list_info bg-fff bsbx lh1">
      <!-- item -->
      <Item :lists="lists" />
      <ItemSpec />
      <Address />
      <Free />
      <!-- 商品详情图片 -->
      <DetailImg :descPics="descPics" />
    </div>
    <!-- fot_text -->
    <FotText />
    <!-- footer -->
    <Footer
      :cartNum="cartNum"
      :productId="lists.productId"
      @addGood="addGood"
      :isLogin="isLogin"
      @purchase="purchase"
    />
  </div>
</template>

<script>
// import { getDetail } from "@/api/product.js";
import NavBar from "@/view/Home/children/goodsChild/NavBar";
import Swiper from "@/view/Home/children/goodsChild/Swiper";
import Item from "@/view/Home/children/goodsChild/Item";
import ItemSpec from "@/view/Home/children/goodsChild/ItemSpec";
import Address from "@/view/Home/children/goodsChild/Address";
import Free from "@/view/Home/children/goodsChild/Free";
import DetailImg from "@/view/Home/children/goodsChild/DetailImg";
import FotText from "@/view/Home/children/goodsChild/FotText";
import Footer from "@/view/Home/children/goodsChild/Footer";

// import { addGood } from "@/api/cart";
import { get, post } from "@/request/index";
import { mapState } from "vuex";
export default {
  data() {
    return {
      lists: [],
      descPics: [],
      banners: [],
      cartNum: 0,
    };
  },
  created() {
    this.getDetail();
    console.log("preorder路由", this.$router);
  },
  components: {
    Swiper,
    NavBar,
    Item,
    ItemSpec,
    Address,
    Free,
    DetailImg,
    FotText,
    Footer,
  },
  methods: {
    getDetail() {
      // let productId = this.$route.params.productId;
      let obj = {
        productId: this.$route.params.productId,
      };
      get("/product/detail", obj)
        .then((res) => {
          let lists = res.result;
          this.lists = lists;
          this.banners = lists.banners;
          this.descPics = lists.descPics;
          this.cartNum = lists.cartNum;
        })
        .catch((err) => console.log("goods获取列表失败", err));
    },
    addGood() {
      let obj = {
        productId: this.$route.params.productId,
      };
      get("/cart/add", obj)
        .then((res) => {
          this.cartNum++;
          this.lists.cartNum++;
          console.log("添加购物车成功", res);
        })
        .catch((err) => console.log("添加商品失败", err));
    },
    purchase() {
      alert("抱歉，此路不通");
      return 0;
      console.log(this.lists);
      post("/preOrder/create", {
        totalMoney: this.lists.minPrice,
        cartId: this.lists,
      })
        .then((res) => {
          console.log("创建预订单");
          console.log(res);
          this.$router.push({
            path: "/order/preOrder",
            query: { preOrderId: res.result.preOrderId },
          });
        })
        .catch((err) => console.log("创建预订单失败", err));
    },
  },
  computed: {
    ...mapState(["isLogin"]),
  },
};
</script>

<style lang="less">
@import "./goodDetail.less";
</style>